<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>mp-wx-tool</title>
    <link rel="stylesheet" href="./resource/bootstrap.min.css">
    <link rel="stylesheet" href="./resource/theme.css">
    <script src="./resource/jquery-3.1.1.min.js"></script>
    <script>if (typeof module === 'object') {window.jQuery = window.$ = module.exports;}</script>
    <script src="./resource/vue.min.js"></script>

    <style media="screen">
        .page{display: none;}
    </style>
  </head>
  <body class="full">
      <div class="viewbody">
          <!--left-->
          <div class="viewbody-left menu">
              <ul class="nav">
                  <li><a href="javascript:changeMenu('menu');">菜单</a></li>
                  <li><a href="javascript:changeMenu('media');">素材</a></li>
                  <li><a href="javascript:changeMenu('home');">用户</a></li>
                  <li><a href="javascript:changeMenu('home');">……</a></li>
              </ul>
          </div>
          <!--center-->
          <div class="viewbody-center">
              <div class="container-fluid">
                  <div id="home" class="row-fluid page" id="home">
                      <h1>Home</h1>
                  </div>
                  <!-- menuid-->
                  <div class="row-fluid page" id="menu">
                      <button type="button" class='btn' v-on:click="getmenus" name="button">获取菜单</button>
                  </div>
                  <!-- menu -->
                  <!--media-->
                  <div class="row-fluid page" id="media">
                      <div>
                          <div class="row">
                              <div class="col-md-6">
                                  <div class="btn-group" id="qtype">
                                      <a href="#" class="btn btn-default" v-on:click="query($event, 'image')">图片<span class="badge">{{all.image_count}}</span></a>
                                      <a href="#" class="btn btn-default" v-on:click="query($event, 'news')">图文<span class="badge">{{all.news_count}}</span></a>
                                      <a href="#" class="btn btn-default" v-on:click="query($event, 'voice')">语音<span class="badge">{{all.voice_count}}</span></a>
                                      <a href="#" class="btn btn-default" v-on:click="query($event, 'video')">视频<span class="badge">{{all.video_count}}</span></a>
                                  </div>
                                  <!--<button type="button" class='btn btn-xs btn-primary' name="button" v-on:click='query'>查询</button>-->
                              </div>
                              <div class="col-md-6 text-right">
                                  <div class="btn-group">
                                      <button type="button" name="button" class="btn btn-default" v-on:click='addtempfile'>添加临时素材</button>
                                      <button type="button" name="button" class="btn btn-default" v-on:click="addfile">添加永久素材</button>
                                  </div>
                              </div>
                          </div>
                          <div>
                              <table class="table table-bordered table-striped">
                                  <tr>
                                      <th>#</th>
                                      <th>素材id</th>
                                      <th>文件名称</th>
                                      <th>文件连接</th>
                                      <th>图文地址</th>
                                      <th>最后更新时间</th>
                                  </tr>
                                  <tbody>
                                      <tr v-for='(row, index) in grid.rows'>
                                          <td>{{index+1}}</td>
                                          <td>{{row.media_id}} <a href="#" v-on:click="deletemedia(row.media_id)">删除</a></td>
                                          <td>{{row.name}}</td>
                                          <td><a v-if="row.url" target='_blank' v-bind:href="row.url">here</a></td>
                                          <td><button v-if="row.content" type="button" name="button" v-on:click="shownews(index);">详情</button></td>
                                          <td>{{new Date(row.update_time * 1000).toLocaleString()}}</td>
                                      </tr>
                                  </tbody>
                              </table>
                          </div>
                      </div>
                  </div>
                  <!--media end-->
              </div>
          </div>
          <!--cenetr end-->
      </div>

      <div class="mask">
      </div>

  </body>
  <script src="./resource/comm.js" ></script>
  <script type="text/javascript">
    let token = null;
    function changeMenu(id) {
        $('.page').hide();
        $('#' + id).show();
    }

    //菜单
    var menuVue = new Vue({
        el:"#menu",
        data:{
            all:{}
        },
        methods:{
            getmenus:function() {
                let obj = this;
                $.ajax({
                    url:'https://api.weixin.qq.com/cgi-bin/menu/get?access_token='+ token,
                    dataType:'json',
                    success:function (res) {
                        let ass = assert(res);
                        if (ass) {
                            alert(ass);
                            return;
                        }
                        obj.all = res;
                    },
                    error:function () {

                    }
                });
            },
            deletemenu:function () {
                $.ajax({
                    url:'https://api.weixin.qq.com/cgi-bin/menu/delete?access_token='+ token,
                    dataType:'json',
                    success:function (res) {
                        let ass = assert(res);
                        if (ass) {
                            alert(ass);
                            return;
                        }
                        //OK
                    },
                    error:function () {

                    }
                });
            },
            addmenu:function () {
                $.post('https://api.weixin.qq.com/cgi-bin/menu/create?access_token='+ token,
                {},
                function (res) {
                    let ass = assert(res);
                    if (ass) {
                        alert(ass);
                        return;
                    }
                    //OK
                });
            }
        }
    });

    //用户管理
    var mpUser = {
        addtag:function () {
            var tags ={ tag:{ name:"test"} };
            $.post('https://api.weixin.qq.com/cgi-bin/tags/create?access_token=' + token,
            JSON.stringify(tags),
            function (res) {
                let ass = assert(res);
                if (ass) {
                    alert(ass);
                    return;
                }
                //OK
            });
        },
        gettargs:function () {
            $.getJSON('https://api.weixin.qq.com/cgi-bin/tags/get?access_token=' + token,
            null,
            function (res) {
                let ass = assert(res);
                if (ass) {
                    alert(ass);
                    return;
                }
<<<<<<< HEAD
                let rows = res.tags;
                console.log(res);
            });
        },
        edittarg:function(){
            let d ={tag:{id:123, name:"123"}};
            $.post('https://api.weixin.qq.com/cgi-bin/tags/update?access_token=' + token,
            JSON.stringify(d),
            function (res) {
                let ass = assert(res);
                if (ass) {
                    alert(ass);
=======
                let f = files[0];
                console.log(t);
                console.log(f);
                tip.classList.remove('alert-danger');
                tip.innerHTML = '';
                //api
                var fd = new FormData();
                fd.append('filename', f.name);
                fd.append('filelength', f.size);
                fd.append('content-type', f.type);
                fd.append('media', f);
                //
                $.ajax({
                    url:'https://api.weixin.qq.com/cgi-bin/media/upload?access_token='+token+'&type='+ t,
                    data:fd,
                    type:'POST',
                    contentType: false,
                    processData: false,
                    dataType:'json',
                    success: function (res) {
                        //console.log(JSON.stringify(res));
                        var ast = assert(res);
                        if (!ast) {
                            console.log(res);
                            tip.classList.add('alert-success');
                            tip.innerHTML = JSON.stringify(res);
                            return;
                        }
                        alert(ast)
                    },
                    error: function (er) {

                    }
                });
            },
            addfile:function () {
                let html='<form class="form-horizontal" enctype="multipart/form-data"><div class="form-group">'
                +'<label class="col-sm-2 control-label" for="temptype">类型</label>'
                +'<div class="col-sm-10"><select id="temptype" name="type" class="form-control">'
                +'<option value="image">图片</option><option value="voice">语音</option><option value="video">视频</option>'
                +'<option value="thumb">缩略图</option></select></div></div><div class="form-group">'
                +'<label class="col-sm-2 control-label" for="tempfile">文件</label>'
                +'<div class="col-sm-10"><input name="file1" type="file" id="tempfile"></div></div>'
                +'<div class="alert" style="padding:3px; margin-bottom:5px; word-wrap:break-word;" name="tip"></div>'
                +'<button type="button" class="btn btn-primary" onclick="media.postfile(this);" >'
                +'提&nbsp;交</button></form>';
                let setting = {
                    title:'新增永久素材',
                    size:'small'
                };
                setting.html = html;
                showdialog(setting);
            },
            postfile:function(e){
                let t = e.form.type.value;
                let tip = e.form.children.tip;
                if (!t) {
                    tip.classList.add('alert-danger');
                    tip.innerHTML = '无效的类型';
>>>>>>> c7fb10cc1572a8d21c7e1309aae8ac0df80b89c8
                    return;
                }
                //ok
            });
        },
        deletetarg:function(){
            let d ={tag:{id:123}};
            $.post('https://api.weixin.qq.com/cgi-bin/tags/delete?access_token=' + token,
            JSON.stringify(d),
            function (res) {
                let ass = assert(res);
                if (ass) {
                    alert(ass);
                    return;
                }
<<<<<<< HEAD
                //ok
            });
        },
        getusersbytag:function(){
            let d ={tagid:123, next_openid:''};
            $.getJSON('https://api.weixin.qq.com/cgi-bin/user/tag/get?access_token=' + token,
            JSON.stringify(d),
            function (res) {
                let ass = assert(res);
                if (ass) {
                    alert(ass);
                    return;
                }
                //ok
                let count = res.count;//总行数
                let next_openid = res.next_openid; //列表最后一个openid, 用于分页
                let rows = res.data.opendid;//数据记录
            });
        },
        tagging:function () {
            //打标签
            let d = {
                tagid:123, //标签id
                openid_list:[] //粉丝openid列表
            };
            $.post('https://api.weixin.qq.com/cgi-bin/tags/members/batchuntagging?access_token=' + token,
            JSON.stringify(d),
            function (res) {
                let ass = assert(res);
                if (ass) {
                    alert(ass);
                    return;
                }
                //ok
            });
        },
        untagging:function () {
            //取消标签
            let d = {
                tagid:123, //标签id
                openid_list:[] //粉丝openid列表
            };
            $.post('https://api.weixin.qq.com/cgi-bin/tags/members/batchuntagging?access_token=' + token,
            JSON.stringify(d),
            function (res) {
                let ass = assert(res);
                if (ass) {
                    alert(ass);
                    return;
                }
                //ok
            });
        }，
        gettagsbyopenid: function() {
            //获取用户身上的标签列表
            let d = {
                openid:'', //
            };
            $.post('https://api.weixin.qq.com/cgi-bin/tags/members/batchuntagging?access_token=' + token,
            JSON.stringify(d),
            function (res) {
                let ass = assert(res);
                if (ass) {
                    alert(ass);
                    return;
                }
                //ok
                let list = res.tagid_list;//被置上的标签列表
=======
                let f = files[0];
                console.log(t);
                console.log(f);
                tip.classList.remove('alert-danger');
                tip.innerHTML = '';
                //api
                var fd = new FormData();
                fd.append('filename', f.name);
                fd.append('filelength', f.size);
                fd.append('content-type', f.type);
                fd.append('media', f);
                //
                $.ajax({
                    url:'https://api.weixin.qq.com/cgi-bin/material/add_material?access_token='+token+'&type='+ t,
                    data:fd,
                    type:'POST',
                    contentType: false,
                    processData: false,
                    dataType:'json',
                    success: function (res) {
                        //console.log(JSON.stringify(res));
                        var ast = assert(res);
                        if (!ast) {
                            console.log(res);
                            tip.classList.add('alert-success');
                            tip.innerHTML = JSON.stringify(res);
                            return;
                        }
                        alert(ast)
                    },
                    error: function (er) {

                    }
                });
            },
            addnews:function () {

            },
            shownews:function (i) {
                let row = this.grid.rows[i];
                let setting = {
                    title:'news'
                };
                let str ='<div class="panel panel-default" style="margin-bottom:0;">'
                +'<div class="panel-heading">图文详情</div>'
                +'<div class="panel-body" style="max-height:557px;overflow-y:scroll;">';

                if (row.content.news_item.length> 0) {
                    for (let i = 0; i < row.content.news_item.length; i++) {
                        let c = row.content.news_item[i];
                        let s ='<div style="margin-bottom:10px;">';
                        s += '<div class="row border-bottom"><div class="col-sm-2">标题：</div><div class="col-sm-10 wrap">'+c.title+'</div></div>';
                        s += '<div class="row border-bottom"><div class="col-sm-2">作者：</div><div class="col-sm-10 wrap">'+c.author+'</div></div>';
                        s += '<div class="row border-bottom"><div class="col-sm-2">摘要：</div><div class="col-sm-10 wrap">'+c.digest+'</div></div>';
                        s += '<div class="row border-bottom"><div class="col-sm-2">封面：</div><div class="col-sm-10 wrap">'+(c.show_cover_pic? "有封面":"无封面")+'</div></div>';
                        s += '<div class="row border-bottom"><div class="col-sm-2">配图：</div><div class="col-sm-10 wrap">'+c.thumb_url+'</div></div>';
                        s += '<div class="row border-bottom"><div class="col-sm-2">素材：</div><div class="col-sm-10 wrap">'+c.thumb_media_id+'</div></div>';
                        s += '<div class="row border-bottom"><div class="col-sm-2">原文：</div><div class="col-sm-10 wrap"><a target="_blank" href="'+c.content_source_url+'">'+c.content_source_url+'</a></div></div>';
                        s += '<div class="row border-bottom"><div class="col-sm-2">连接：</div><div class="col-sm-10 wrap"><a target="_blank" href="'+c.url+'">'+c.url+'</a></div></div>';
                        s += '</div>';
                        str += s;
                    }
                }
                str = str + '</div></div>';
                setting.html = str;
                showwindow(setting);
            },
            deletemedia: function(id){
                if (!confirm('确认删除吗？','提示')) {
                    return;
                }
                let grid = this.grid;
                let callback = this.getlist;
                $.ajax({
                    url:'https://api.weixin.qq.com/cgi-bin/material/del_material?access_token='+ token,
                    contentType:'application/json',
                    data: JSON.stringify( {"media_id": id}),
                    type:'POST',
                    dataType:'json',
                    success:function(res) {
                        var ast = assert(res);
                        if (!ast) {
                            console.log(res);
                            if (res.errcode == 0) {
                                callback(grid.type, grid.offset);
                            }                            
                            return;
                        }
                        alert(ast)
                    }
                });
>>>>>>> c7fb10cc1572a8d21c7e1309aae8ac0df80b89c8

            });
        },
        addmark:function () {
            //备注
            
        }
    };

    //ready
    $(function () {
        changeMenu('home');
        refreshToken();
        changeSize();

        media.getall();
    });

  </script>
</html>
